@import '@/app/styles/variables';

.options {
    width: 100% !important;
    height: min-content;
    border: 1px solid #F3F3F3;
    gap: 16px;
    border-radius: 24px;
    border: 1px solid #F3F3F3;
}

.small {
    padding: 16px !important;
}

.medium {
    padding: 24px 32px;
}

.big {
    padding: 32px;
}

.divider {
    width: auto;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.option {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    width: 100% !important;
    justify-content: space-between;

    svg {
        transform: scale(1.4);
    }

    &:hover {
        cursor: pointer;
    }
}

.padding_bottom {
    padding-top: 16px !important;
}

.padding_top {
    padding-bottom: 16px !important;
}

.gray {
    background-color: gray;
}

@include media(sm) {
    .option {
        svg {
            transform: scale(1.1);
        }
    }

    .divider {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }

    .big {
        padding: 16px;
    }

    .medium {
        padding: 16px;
    }
}